<!DOCTYPE html>
<html lang="en">
<head>
  <!-- Required meta tags -->
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <link rel="stylesheet" href="assets/css/bootstrap.min.css">
  <link rel="stylesheet" href="assets/css/style.css">
  <title>小王的个人网</title>
</head>

<body>
<div class="adcenter"><script src="http://www.baisheng999.com/include/new/ggad2_728x90.js"></script></div>
<!-- 导航栏 -->
  <nav class="navbar navbar-expand-md  fixed-top maine-menu">
    <div class="container">
      <button class="navbar-toggler ml-auto" data-target="#my-nav" onclick="myFunction(this)" data-toggle="collapse"> <span class="bar1"></span> <span class="bar2"></span> <span class="bar3"></span> </button>
      
	  <div id="my-nav" class="collapse navbar-collapse">
        <ul class="navbar-nav mx-auto">
          <li class="nav-item active"> <a class="nav-link" href="#">首页</a> </li>
          <li class="nav-item"> <a class="nav-link" href="#about" tabindex="-1" aria-disabled="true">个人介绍</a></li>
          <li class="nav-item"> <a class="nav-link" href="#activity" tabindex="-1" aria-disabled="true">网页作品</a></li>
          <li class="nav-item"> <a class="nav-link" href="#portfolio" tabindex="-1" aria-disabled="true">设计作品</a></li>
        </ul>
      </div>
	  
    </div>
  </nav>
  <!-- 导航栏end -->
  
  <!-- banner背景 -->
  <div class="container-fluid fh5co-home-banner">
    <div class="card"> <img class="card-img" src="assets/img/banner-img.jpg" alt="">
      <div class="card-img-overlay">
        <div class="center-text">
          <h2 class="card-title">你好<br>这里是王成兴的个人网站</h2>
          <a href="#" class="btn">
            <svg width="201" height="51" viewBox="0 0 201 51">
              <defs>
                <style>
                .cls-1 {
                  fill: none;
                  stroke-width: 1px;
                  stroke: url(#linear-gradient);
                }
              </style>
              <linearGradient id="linear-gradient" x1="140.508" y1="50.5" x2="60.492" y2="0.5" gradientUnits="userSpaceOnUse">
                <stop offset="0" stop-color="#cc00ff"/>
                <stop offset="1" stop-color="#fff"/>
              </linearGradient>
            </defs>
            <rect id="Rounded_Rectangle_1" data-name="Rounded Rectangle 1" class="cls-1" x="0.5" y="0.5" width="200" height="50" rx="25" ry="25"/>
          </svg>
        希望你会喜欢</a> </div>
      </div>
    </div>
  </div>
  <!-- banner背景结束 -->
  
  <!-- 个人介绍背景 -->
  <div class="container-fluid fh5co-two-img">
    <div class="row">
      <div class="col-sm-6 pr-0 pl-0">
        <div class="card"> <img class="card-img" src="assets/img/girl1.jpg" alt="">
          <div class="card-img-overlay"> </div>
        </div>
      </div>
      <div class="col-sm-6 pr-0 pl-0">
        <div class="card"> <img class="card-img" src="assets/img/girl2.jpg" alt="">
          <div class="card-img-overlay"> </div>
        </div>
      </div>
    </div>
  </div>
<!-- 个人介绍背景结束 -->
<!-- 个人介绍 -->
  <div class="container-fluid fh5co-recent-work">
    <div class="container contact-pop">
      <div class="row">
        <div class="col-md-6  pr-0">
          <div class="card"> <img class="card-img w-100" src="assets/img/girl3.jpg" alt="">
            <div class="card-img-overlay"> </div>
          </div>
        </div>
        <div class="col-md-6 pl-0" id="about">
          <div class="content">
            <h3>我叫王成兴</h3>
            <h4>是一名网络前端工程师</h4>
            <hr />
            <p>我能够熟练使用ps软件，设计网页布局图，使用Axure制作原型图。
				掌握HTML5,CSS3,JavaScript等语言，并写出网站
				了解Angular、React、Vue框架，完成软件开发与制作
				掌握Bootstrap、node.js、get的使用</p>
            <a href="#" class="btn">接触了解</a> </div>
          </div>
        </div>
      </div>
	  <!-- 个人介绍结束 -->
	  <!-- 网页做品 -->
      <div class="container recent" id="activity">  
        <div class="row">
          <h2>网页作品</h2>
          <div class="owl-carousel owl-carousel2 owl-theme">
            <div>
              <div class="card"> <img class="card-img" src="assets/img/recent-img1.jpg" alt="">
                <div class="card-img-overlay"> <a href="#"><img src="assets/img/heart.png" class="heart" alt="heart icon"></a>
                  <div class="bottom-text">
                    <h5 class="card-title">重庆盈洪金属静态网页</h5>
                    <p class="card-text"><a href=" http://broken-heart-lian.gitee.io/yinghong-metal">了解详情</a></p>
                  </div>
                </div>
              </div>
            </div>
            <div>
              <div class="card"> <img class="card-img" src="assets/img/recent-img5.jpg" alt="">
                <div class="card-img-overlay"> <a href="#"><img src="assets/img/heart.png" class="heart" alt="heart icon"></a>
                  <div class="bottom-text">
                    <h5 class="card-title">泷邦盛汇静态网页</h5>
                    <p class="card-text"><a href="https://broken-heart-lian.gitee.io/tak-bang-sheng-hui/html">了解详情</a></p>
                  </div>
                </div>
              </div>
            </div>
            <div>
              <div class="card"> <img class="card-img" src="assets/img/recent-img3.jpg" alt="">
                <div class="card-img-overlay"> <a href="#"><img src="assets/img/heart.png" class="heart" alt="heart icon"></a>
                  <div class="bottom-text">
                    <h5 class="card-title">音乐播放器设计</h5>
                    <p class="card-text"><a href="http://broken-heart-lian.gitee.io/music">了解详情</a></p>
                  </div>
                </div>
              </div>
            </div>
            <div>
              <div class="card"> <img class="card-img" src="assets/img/recent-img4.jpg" alt="">
                <div class="card-img-overlay"> <a href="#"><img src="assets/img/heart.png" class="heart" alt="heart icon"></a>
                  <div class="bottom-text">
                    <h5 class="card-title">彭水旅游网设计</h5>
                    <p class="card-text"><a href="http://broken-heart-lian.gitee.io/pengshui-tourism-network">了解详情</a></p>
                  </div>
                </div>
              </div>
            </div>
			<div>
			  <div class="card"> <img class="card-img" src="assets/img/recent-img6.jpg" alt="">
			    <div class="card-img-overlay"> <a href="#"><img src="assets/img/heart.png" class="heart" alt="heart icon"></a>
			      <div class="bottom-text">
			        <h5 class="card-title">重庆市人民政府网静态网页</h5>
			        <p class="card-text"><a href=" http://broken-heart-lian.gitee.io/peoples-government">了解详情</a></p>
			      </div>
			    </div>
			  </div>
			</div>
			<div>
			  <div class="card"> <img class="card-img" src="assets/img/recent-img7.jpg" alt="">
			    <div class="card-img-overlay"> <a href="#"><img src="assets/img/heart.png" class="heart" alt="heart icon"></a>
			      <div class="bottom-text">
			        <h5 class="card-title">武警部队网静态网页</h5>
			        <p class="card-text"><a href="http://broken-heart-lian.gitee.io/armed-police">了解详情</a></p>
			      </div>
			    </div>
			  </div>
			</div>
          </div>
        </div>
      </div>
	  <!-- 网页作品结束 -->
    </div>
  </div>
  
  
  <!-- 设计作品 -->
  <div class="container-fluid recent fh5co-portfolio" id="portfolio">
    <div class="container">
      <h2>设计作品</h2>
      <div class="row">
        <div class="bx bx-1">
          <div class="card"> <img class="card-img" src="assets/img/portfolio-img1.png" alt="">
            <div class="card-img-overlay"> <a href="#"><img src="assets/img/heart.png" class="heart" alt="heart icon"></a>
              <div class="bottom-text">
                <h5 class="card-title">图标</h5>
              </div>
            </div>
          </div>
        </div>
        <div class="bx bx-2">
          <div class="card"> <img class="card-img" src="assets/img/portfolio-img2.png" alt="">
            <div class="card-img-overlay"> <a href="#"><img src="assets/img/heart.png" class="heart" alt="heart icon"></a>
              <div class="bottom-text">
                <h5 class="card-title">简易邮箱界面设计</h5>
              </div>
            </div>
          </div>
        </div>
        <div class="bx bx-3">
          <div class="card"> <img class="card-img" src="assets/img/portfolio-img3.png" alt="">
            <div class="card-img-overlay"> <a href="#"><img src="assets/img/heart.png" class="heart" alt="heart icon"></a>
              <div class="bottom-text">
                <h5 class="card-title">线性临摹</h5>
              </div>
            </div>
          </div>
        </div>
        <div class="bx bx-4">
          <div class="card"> <img class="card-img" src="assets/img/portfolio-img4.png" alt="">
            <div class="card-img-overlay"> <a href="#"><img src="assets/img/heart.png" class="heart" alt="heart icon"></a>
              <div class="bottom-text">
                <h5 class="card-title">矢量图标</h5>
              </div>
            </div>
          </div>
        </div>
        <div class="bx bx-middle" style="padding: 0;">
          <div class="bx bx-5">
            <div class="card"> <img class="card-img" src="assets/img/portfolio-img5.png" alt="">
              <div class="card-img-overlay"> <a href="#"><img src="assets/img/heart.png" class="heart" alt="heart icon"></a>
                <div class="bottom-text">
                  <h5 class="card-title">动物图标</h5>
                </div>
              </div>
            </div>
          </div>
          <div class="bx bx-6">
            <div class="card"> <img class="card-img" src="assets/img/portfolio-img6.png" alt="">
              <div class="card-img-overlay"> <a href="#"><img src="assets/img/heart.png" class="heart" alt="heart icon"></a>
                <div class="bottom-text">
                  <h5 class="card-title">mbe风格图标</h5>
                </div>
              </div>
            </div>
          </div>
          <div>
            <div class="bx bx-7">
              <div class="card"> <img class="card-img" src="assets/img/portfolio-img7.png" alt="">
                <div class="card-img-overlay"> <a href="#"><img src="assets/img/heart.png" class="heart" alt="heart icon"></a>
                  <div class="bottom-text">
                    <h5 class="card-title">登录注册设计</h5>
                  </div>
                </div>
              </div>
            </div>
            <div class="bx bx-8">
              <div class="card"> <img class="card-img" src="assets/img/portfolio-img8.png" alt="">
                <div class="card-img-overlay"> <a href="#"><img src="assets/img/heart.png" class="heart" alt="heart icon"></a>
                  <div class="bottom-text">
                    <h5 class="card-title">海报设计</h5>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <!-- 设计作品结束 -->
  

  
  
  
  <footer class="container-fluid p-0 pr-0">
    <div class="copy pt-4 pb-4">
      <p><a href="https://cssmoban/" target="_blank"> &copy; 王成兴</a>  &nbsp;  |  &nbsp; 联系电话：13667669755 &nbsp; | &nbsp; 联系邮箱：329520908@qq.com</p>
    </div>
  </footer>

  <!-- jQuery first, then Popper.js, then Bootstrap JS --> 
  <script src="assets/js/jquery-3.3.1.slim.min.js"></script> 
  <script src="assets/js/popper.min.js" ></script> 
  <script src="assets/js/bootstrap.min.js"></script> 
  <script src="assets/js/owl.carousel.min.js"></script> 
  <script src="assets/js/main.js"></script>

</body>
</html>